import { defineStore } from 'pinia'
import * as PIXI from 'pixi.js'
import { useWindowSize } from '@vueuse/core'
import NInput from '@/components/NInput/index.vue'
import NTextarea from '@/components/NTextarea/index.vue'
import NFile from '@/components/NFile/index.vue'

const { width } = useWindowSize()
const useMainStore = defineStore('main', {
  state: () => ({
    app: null as PIXI.Application | null, //PIXI实例
    width: 1919, //标准宽度
    pixiApp: null as Promise<PIXI.Application<PIXI.Renderer>> | null, //PIXI实例
    nInput: null as InstanceType<typeof NInput> | null, //输入框
    nTextarea: null as InstanceType<typeof NTextarea> | null, //多行输入框
    nFile: null as InstanceType<typeof NFile> | null, //文件上传
    nJsonFile: null as InstanceType<typeof NFile> | null, //json文件上传
  }),
  getters: {
    getAppAttr: state => {
      return {
        scale: width.value / state.width, // 宽高比
        cbWidth: state.width, //宽度
        nInput: state.nInput,
      }
    },
  },
  actions: {
    setApp(app: PIXI.Application) {
      this.app = app
    },
    initApp(init: () => Promise<PIXI.Application<PIXI.Renderer>>) {
      this.pixiApp = init()
    },
    async getApp(): Promise<PIXI.Application> {
      return (await this.pixiApp) as PIXI.Application
    },
    setNInput(nInput: InstanceType<typeof NInput>) {
      this.nInput = nInput
    },
    setNTextarea(nTextarea: InstanceType<typeof NTextarea>) {
      this.nTextarea = nTextarea
    },
    setNFile(nFile: InstanceType<typeof NFile>) {
      this.nFile = nFile
    },
    setNJsonFile(nJsonFile: InstanceType<typeof NFile>) {
      this.nJsonFile = nJsonFile
    },
  },
})

export default useMainStore
